<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Cache-Control" content="no-cache" />
<!--meta-->
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no;">
<title>{{$pageTitle}}-{{$site[title]}}</title>
<style>*{padding:0;margin:0;} body,.container{max-width: 100% !important;}</style>

<?PHP echo $this->Combinator->less(); ?>
{{$this->Html->css(array('font-awesome.min.css','ui-customer.css',));}}
<style>
@charset "utf-8";
/*css reset*/
body{background:#f3f3f3;}
body,button,input,select,textarea{ font-size:14px;}
h1,h2,.Content-title{font-size:20px;}
h3{font-size:18px;}
a{text-decoration:none;color:#31497c;}
a.red{text-decoration:none;color:#ff0000;}
a.black{text-decoration:none;color:#000000;}
a.green{text-decoration:none;color:#1ca446;}
a:hover{text-decoration:none; }
img,.Content-body img { border:0;vertical-align:middle;max-width:95%;margin: 5px 5px;}
.Content-body{padding:0;}
button,input,select,textarea{font-size:100%; vertical-align:middle}
header, footer, article, section, nav, menu, hgroup,time{display: block;clear:all; }
.wrap{width:98%;line-height:18px;}
.navbar {margin-bottom: 0px;}
.panel {border:0;}
.panel-body {padding:0px;}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{padding:3px;}
#maincontent{max-width:560px;margin:10px auto;background: transparent;box-sizing: border-box;padding: 15px 0;}
.breadcrumb,.ui-portlet-header{padding-left: 0px;}
hr,.ui-portlet{margin:5px 0;}
.nav-pills > li >a{    padding: 5px 10px !important;   margin-right: 10px !important;}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-left: 5px;
    padding-right: 5px;
}
.row,.form-horizontal .form-group {
    margin-left: -5px;
    margin-right: -5px;
}
#questionnaire-detail{min-height:360px;}
.question-options{margin:20px 0;color:#333;}
table{width:100%;border-spacing:10px;border-collapse: separate;margin:0px;padding:0px;}
tr{background-color: #fafafa;}
td.active{background-color: #d9d9d9;}
td.correct{background-color: #dff0d8;border-color: #d6e9c6;color: #468847;}
td,th{padding:10px 15px;}
label{cursor: pointer;}
.btn-primary{background-color: #0c9794;font-size:20px;color:#FFF;}
h3{color:#0c9794;line-height: 1.6em;padding:0 15px;}
</style>

{{$this->Html->script(array(
            'jquery/jquery.min.js',
            'jquery/jquery.cookie.js',           
            'bootstrap.min.js',
            'jquery/jquery.lazyload.js',
            'common.js','front.js',
        ));
}}

<script type="text/javascript">
var BASEURL = "{{APP_SUB_DIR}}";
var ADMIN_BASEURL = BASEURL+"/manage";
var survey_ids = [<?php echo implode(',',$survey_ids) ?>];
var current_idx = 0;
var total = {{$total}};
var exam = '{{$exam}}';
</script>
<noscript>
请开启您浏览器的JavaScript选项
</noscript>
</head>
<body>

	
	<script type="text/javascript">
	//<![CDATA[
	function submit_survey(){
		
		if($('#survey-form').find('input:checked').size() == 0 ){
			alert('请先选择选项后再提交');
			return false;
		}
		$('#publisher_submit').attr('disabled',true);
		
		$.ajax({
			async:true, 
			type:'post', 
			success:function(request, xhr) {
				
				$('#publisher_submit').removeAttr('disabled');
				
					if(request.ret == 0) {						
						if( request.is_correct == true) {
							$('.question-options').append('<div class="alert alert-success" style="font-size:24px;margin:10px;text-align:center">回答正确</div>');
						}
						else{
							$('.question-options').append('<div class="alert alert-danger" style="font-size:24px;margin:10px;text-align:center">回答错误</div>');
						}
						
						if(request.survey && request.survey.content) {
							$('.question-options').append('<div style="padding:10px">'+request.survey.content+'</div>');
						}
						$('.question-options td').addClass('hidden');
						for(var i in request.correct_options) {
							$('#option-'+request.correct_options[i]).removeClass('hidden').addClass('correct').find('input').prop('checked',true);
						}
						$('#next_survey').removeClass('hidden');
						$('#publisher_submit').addClass('hidden');
					}
					else
					{
						showErrorMessage(request.msg);
					}
			}, 
			data:$('#survey-form').serialize(), 
			url:'/survey_stats/singlesubmit',
			dataType:'json'
		});
		return false; 
	}

	function load_survey(){
		if( total > 0 ) {
			if(current_idx < total) {
				$('#questionnaire-detail').load('/surveys/view/'+survey_ids[current_idx]+' #survey-detail',function(){
					current_idx++;
					$('#current-idx').html(current_idx);
					$('#next_survey').addClass('hidden');
					$('#publisher_submit').removeClass('hidden');
				});
			}
			else{
				window.location.href="/questionnaires/result/{{$exam}}";
				//alert('已答完');
			}
		}
		else{
			$('#questionnaire-detail').html('还没有添加问卷题');
		}
	}

	$(function(){
		load_survey();
		$(document).on('click','.question-options td',function(){
			if( $(this).find('input:radio').size() > 0 ){
				$('.question-options td').find('input:radio').prop("checked",false);
				$(this).find('input:radio').prop('checked',true);
				$('.question-options td').removeClass('active');
				$(this).addClass('active');
			}
			else if($(this).find('input:checkbox').size() > 0){
				if($(this).find('input:checkbox').prop("checked") == true ){
					$(this).find('input:checkbox').prop("checked",false);
					$(this).removeClass('active');
				}
				else{
					$(this).find('input:checkbox').prop("checked",true);
					$(this).addClass('active');
				}
			}
			return false;
		});
	});
	//]]>
	</script>
	<div id="maincontent">
		<form accept-charset="utf-8" method="post" onsubmit="return false;" id="survey-form">
		<div id="questionnaire-detail">
		</div>
		<fieldset>
		<input type="hidden" name="model" value="Questionnaire">
		<input type="hidden" name="exam" value="{{$exam}}">
		<input type="hidden" name="data_id" value="{{$Questionnaire['id']}}">
		<div class="text-center" style="padding:10px;">			
			<div>
				<button id="next_survey"  class="btn btn-primary btn-block hidden" onclick="load_survey();" href="javascript:void(0)">下一题</button>
				<button id="publisher_submit"  class="btn btn-primary btn-block" onclick="submit_survey();" href="javascript:void(0)">提交</button>
			</div>
			<P style="text-align:center;color:#0c9794;margin-top: 20px;"><span id="current-idx">1</span> / <span>{{$total}}</span></P>
		</div>		
		</fieldset>
		</form>
	</div>

</body>
</html>